/**
Oman LNG 
**/

/*Slider styles*/
@import url('../rs-plugin_/settings.css');
@import url('../rs-plugin_/layers.css');
@import url('../rs-plugin_/navigation.css');
/*Line icons*/
@import url('line-awesome.min.css');
/*Swiper*/
@import url('swiper.css');
/*Data Table*/
@import url('dataTables.min.css');

/*
Load custom fonts of LNG 
*/

@font-face {
    font-family: 'Fedra Sans';
    src: url('../fonts/FedraSans-Medium.eot');
    src: local('Fedra Sans Medium'), local('FedraSans-Medium'),
        url('../fonts/FedraSans-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/FedraSans-Medium.woff2') format('woff2'),
        url('../fonts/FedraSans-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fedra Sans';
    src: url('../fonts/FedraSans-Light.eot');
    src: local('Fedra Sans Light'), local('FedraSans-Light'),
        url('../fonts/FedraSans-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/FedraSans-Light.woff2') format('woff2'),
        url('../fonts/FedraSans-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fedra Sans';
    src: url('../fonts/FedraSans-Normal.eot');
    src: local('Fedra Sans Normal'), local('FedraSans-Normal'),
        url('../fonts/FedraSans-Normal.eot?#iefix') format('embedded-opentype'),
        url('../fonts/FedraSans-Normal.woff2') format('woff2'),
        url('../fonts/FedraSans-Normal.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fedra Sans';
    src: url('../fonts/FedraSans-Bold.eot');
    src: local('Fedra Sans Bold'), local('FedraSans-Bold'),
        url('../fonts/FedraSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/FedraSans-Bold.woff2') format('woff2'),
        url('../fonts/FedraSans-Bold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PF DinText Arabic';
    src: url('../fonts/PFDinTextArabic-Regular.eot');
    src: local('PFDinTextArabic-Regular'),
        url('../fonts/PFDinTextArabic-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PFDinTextArabic-Regular.woff2') format('woff2'),
        url('../fonts/PFDinTextArabic-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PF DinText Arabic';
    src: url('../fonts/PFDinTextArabic-Light.eot');
    src: local('PFDinTextArabic-Light'),
        url('../fonts/PFDinTextArabic-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PFDinTextArabic-Light.woff2') format('woff2'),
        url('../fonts/PFDinTextArabic-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PF DinText Arabic';
    src: url('../fonts/PFDinTextArabic-Medium.eot');
    src: local('PFDinTextArabic-Medium'),
        url('../fonts/PFDinTextArabic-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PFDinTextArabic-Medium.woff2') format('woff2'),
        url('../fonts/PFDinTextArabic-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
/*Changes by NareshKz Start*/
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
	font-family: 'Fedra Sans';
}
#s4-workspace {
	overflow-x: hidden;
}
.ms-webpartzone-cell {
	margin: 0;
}
#s4-bodyContainer {
	padding-bottom: 0;
}
.ms-rtestate-field h4, h4.ms-rteElement-H4 {
	color: inherit;
}
.swiper-button-next{
	background-image: url("../images/design/next.svg") !important;
	background-repeat:no-repeat;
}
.swiper-button-prev{
	background-image: url("../images/design/previous.svg") !important;
	background-repeat:no-repeat;
}
.swiper-button-next:after, .swiper-button-prev:after{
	content:'' !important;
}
.ms-rtestate-field h1, h1.ms-rteElement-H1, .ms-rtestate-field h2, h2.ms-rteElement-H2 {
	color: inherit !important;
}
/*Changes by NareshKz End*/

body {
    font-family: 'Fedra Sans';
    font-size: 16px;
    font-weight: 300;
    font-style: normal;
    line-height: 23px;
    color: rgb(32, 32, 32);
    overflow-x: hidden;
}

a,
a:hover {
    text-decoration: none;
}

p {
    text-align: justify;
}

header {
    z-index: 10;
    width: 100vw;
}

.arabic-text {
    font-family: 'PF DinText Arabic';
    font-size: 16px;
}

.top-links {
    width: 100vw;
    border-bottom: 1px solid rgba(255, 255, 255, 1.0)
}

.top-links a {
    color: #fff;
    border-right: solid 1px #fff;
    font-size: 15px;
    font-weight: 400;
    padding: .3rem 0.5rem;
}

.top-links a:hover {
    background-color: #0089cf;
    transition: all ease-in 0.3s;
    -webkit-transition: all ease-in 0.3s;
}

.brand img {
    max-height: 120px;
}

.navigation {
    width: 100%;
    height: 70px;
    display: table;
    position: relative;
    font-family: inherit;
}

.navigation * {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

.navigation-portrait {
    height: 48px;
}

.navigation-fixed-wrapper {
    width: 100%;
    left: 0;
    z-index: 19998;
    will-change: opacity;
}

.navigation-fixed-wrapper.fixed {
    position: fixed !important;
    -webkit-animation: fade .50s;
    animation: fade .50s;
}

@keyframes fade {
    from {
        opacity: 0.999;
    }

    to {
        opacity: 1;
    }
}

.navigation-fixed-wrapper .navigation {
    margin-right: auto;
    margin-left: auto;
}

.navigation-fixed-placeholder {
    width: 100%;
    display: none;
}

.navigation-fixed-placeholder.navigation-fixed-placeholder.visible {
    display: block;
}

.navigation-hidden {
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute;
    top: -9999px;
}

.align-to-right {
    float: right;
}

.nav-header {
    float: left;
}

.navigation-hidden .nav-header {
    display: none;
}

.nav-brand {
    line-height: 70px;
    padding: 0 15px;
    color: #70798b;
    font-size: 24px;
    text-decoration: none !important;
}

.nav-brand:hover,
.nav-brand:focus {
    color: #70798b;
}

.navigation-portrait .nav-brand {
    font-size: 18px;
    line-height: 48px;
}

.nav-logo>img {
    height: 48px;
    margin: 11px auto;
    padding: 0 15px;
    float: left;
}

.nav-logo:focus>img {
    outline: initial;
}

.navigation-portrait .nav-logo>img {
    height: 36px;
    margin: 6px auto 6px 15px;
    padding: 0;
}

.navigation-portrait .nav-menu>li>a {
    color: #333;
}

.navigation-portrait .submenu-indicator-chevron {
    border-color: transparent #333 #333 transparent;
}

.nav-toggle {
    width: 30px;
    height: 30px;
    padding: 12px 2px 0;
    position: absolute;
    top: 50%;
    margin-top: -14px;
    right: 10px;
    display: none;
    cursor: pointer;
}

.nav-toggle::before {
    content: "";
    position: absolute;
    width: 24px;
    height: 2px;
    background-color: rgb(255, 255, 255);
    border-radius: 10px;
    box-shadow: 0 0.5em 0 0 rgb(255, 255, 255), 0 1em 0 0 rgb(255, 255, 255);
}

.navigation-portrait .nav-toggle {
    display: block;
}

.navigation-portrait .nav-menus-wrapper {
    width: 320px;
    height: 100%;
    top: 0;
    left: -400px;
    position: fixed;
    background-color: #ffffff;
    z-index: 20000;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-transition-duration: .8s;
    transition-duration: .8s;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
}

.navigation-portrait .nav-menus-wrapper.nav-menus-wrapper-right {
    left: auto;
    right: -400px;
}

.navigation-portrait .nav-menus-wrapper.nav-menus-wrapper-open {
    left: 0;
}

.navigation-portrait .nav-menus-wrapper.nav-menus-wrapper-right.nav-menus-wrapper-open {
    left: auto;
    right: 0;
}

.nav-menus-wrapper-close-button {
    width: 30px;
    height: 40px;
    margin: 10px 7px;
    display: none;
    float: right;
    color: #70798b;
    font-size: 26px;
    cursor: pointer;
}

.navigation-portrait .nav-menus-wrapper-close-button {
    display: block;
}

.nav-menu {
    margin: 0;
    padding: 0;
    list-style: none;
    line-height: normal;
    font-size: 0;
}

.navigation-portrait .nav-menu {
    width: 100%;
}

.nav-menu.nav-menu-centered {
    text-align: center;
}

.nav-menu.nav-menu-centered>li {
    float: none;
}

.nav-menu>li {
    display: inline-block;
    float: left;
    text-align: left;
}

.navigation-portrait .nav-menu>li {
    width: 100%;
    position: relative;
    border-top: solid 1px #f0f0f0;
}

.navigation-portrait .nav-menu>li:last-child {
    border-bottom: solid 1px #f0f0f0;
}

.nav-menu+.nav-menu>li:first-child {
    border-top: none;
}

.nav-menu>li>a {
    height: 65px;
    padding: 26px 15px;
    display: inline-block;
    position: relative;
    text-decoration: none;
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 400;
    -webkit-transition: color 0.3s, background 0.3s;
    transition: color 0.3s, background 0.3s;
}

.navigation-portrait .nav-menu>li>a {
    width: 100%;
    height: auto;
    padding: 12px 15px 12px 26px;
}

.nav-menu>li:hover>a,
.nav-menu>li.active>a,
.nav-menu>li.focus>a {
    color: #0089cf;
    background-color: #fff;
}

.nav-menu>li>a>i,
.nav-menu>li>a>[class*="ion-"] {
    width: 18px;
    height: 16px;
    line-height: 16px;
    -webkit-transform: scale(1.4);
    -ms-transform: scale(1.4);
    transform: scale(1.4);
}

.nav-menu>li>a>[class*="ion-"] {
    width: 16px;
    display: inline-block;
    -webkit-transform: scale(1.8);
    -ms-transform: scale(1.8);
    transform: scale(1.8);
}

.navigation-portrait .nav-menu.nav-menu-social {
    width: 100%;
    text-align: center;
}

.nav-menu.nav-menu-social>li {
    text-align: center;
    float: none;
    border: none !important;
}

.navigation-portrait .nav-menu.nav-menu-social>li {
    width: auto;
}

.nav-menu.nav-menu-social>li>a>[class*="ion-"] {
    font-size: 12px;
}

.nav-menu.nav-menu-social>li>a>.fa {
    font-size: 14px;
}

.navigation-portrait .nav-menu.nav-menu-social>li>a {
    padding: 15px;
}

.submenu-indicator {
    margin-left: 6px;
    margin-top: 6px;
    float: right;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.navigation-portrait .submenu-indicator {
    width: 54px;
    height: 44px;
    margin-top: 0;
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
    z-index: 20000;
}

.submenu-indicator-chevron {
    height: 6px;
    width: 6px;
    display: block;
    border-style: solid;
    border-width: 0 1px 1px 0;
    border-color: transparent #fff #fff transparent;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: border 0.3s;
    transition: border 0.3s;
}

.navigation-portrait .submenu-indicator-chevron {
    position: absolute;
    top: 18px;
    left: 24px;
}

.nav-menu>li:hover>a .submenu-indicator-chevron,
.nav-menu>.active>a .submenu-indicator-chevron,
.nav-menu>.focus>a .submenu-indicator-chevron {
    border-color: transparent #0089cf #0089cf transparent;
}

.navigation-portrait .submenu-indicator.submenu-indicator-up {
    -webkit-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.nav-overlay-panel {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    display: none;
    z-index: 19999;
}

.no-scroll {
    touch-action: none;
    overflow-x: hidden;
}

/* SEARCH PANEL */
.nav-search {
    height: 70px;
    float: right;
    z-index: 19998;
}

.navigation-portrait .nav-search {
    height: 48px;
    padding: 0 10px;
    margin-right: 52px;
}

.navigation-hidden .nav-search {
    display: none;
}

.nav-search-button {
    width: 70px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    cursor: pointer;
    background-color: #fbfcfd;
}

.navigation-portrait .nav-search-button {
    width: 50px;
    height: 48px;
    line-height: 46px;
    font-size: 22px;
}

.nav-search-icon {
    width: 14px;
    height: 14px;
    margin: 2px 8px 8px 4px;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    color: #70798b;
    text-align: left;
    text-indent: -9999px;
    border: 2px solid;
    border-radius: 50%;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.nav-search-icon:after,
.nav-search-icon:before {
    content: '';
    pointer-events: none;
}

.nav-search-icon:before {
    width: 2px;
    height: 11px;
    top: 11px;
    position: absolute;
    left: 50%;
    border-radius: 0 0 1px 1px;
    box-shadow: inset 0 0 0 32px;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

.nav-search-button:hover .nav-search-icon {
    color: #8CC152;
}

.nav-search>form {
    width: 100%;
    height: 100%;
    padding: 0 auto;
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #ffffff;
    z-index: 99;
}

.nav-search-inner {
    width: 70%;
    height: 70px;
    margin: auto;
    display: table;
}

.navigation-portrait .nav-search-inner {
    height: 48px;
}

.nav-search-inner input[type=text],
.nav-search-inner input[type=search] {
    height: 70px;
    width: 100%;
    margin: 0;
    padding: 0 12px;
    font-size: 26px;
    text-align: center;
    color: #70798b;
    outline: none;
    line-height: 70px;
    border: none;
    background-color: transparent;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.navigation-portrait .nav-search-inner input[type=text],
.navigation-portrait .nav-search-inner input[type=search] {
    height: 48px;
    font-size: 18px;
    line-height: 48px;
}

.nav-search-close-button {
    width: 28px;
    height: 28px;
    display: block;
    position: absolute;
    right: 20px;
    top: 20px;
    line-height: normal;
    color: #70798b;
    font-size: 20px;
    cursor: pointer;
    text-align: center;
}

.navigation-portrait .nav-search-close-button {
    top: 10px;
    right: 14px;
}

/* NAVIGATION BUTTON */
.nav-button {
    margin: 18px 15px 0;
    padding: 8px 14px;
    display: inline-block;
    color: #fff;
    font-size: 14px;
    text-align: center;
    text-decoration: none;
    border-radius: 4px;
    background-color: #8CC152;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
}

.nav-button:hover,
.nav-button:focus {
    color: #fff;
    text-decoration: none;
    opacity: 0.85;
}

.navigation-portrait .nav-button {
    width: calc(100% - 52px);
    margin: 17px 26px;
}

/* NAVIGATION TEXT */
.nav-text {
    margin: 25px 15px;
    display: inline-block;
    color: #70798b;
    font-size: 14px;
}

.navigation-portrait .nav-text {
    width: calc(100% - 52px);
    margin: 12px 26px 0;
}

.navigation-portrait .nav-text+ul {
    margin-top: 15px;
}

/* DROPDOWN EXTENSION */
.nav-dropdown {
    min-width: 200px;
    margin: 0;
    padding: 0;
    display: none;
    position: absolute;
    list-style: none;
    z-index: 98;
    white-space: nowrap;
}

.navigation-portrait .nav-dropdown {
    width: 100%;
    position: static;
    left: 0;
}

.nav-dropdown .nav-dropdown {
    left: 100%;
    top: -1px;
    box-shadow: 0px 5px 20px 5px rgba(43, 43, 43, 0.4);
}

.nav-menu>li>.nav-dropdown {
    box-shadow: 0px 5px 20px 5px rgba(43, 43, 43, 0.4);
}

.nav-dropdown>li {
    width: 100%;
    float: left;
    clear: both;
    position: relative;
    text-align: left;
    border-top: 1px solid rgb(189, 187, 187);
}

.nav-dropdown>li>a {
    width: 100%;
    padding: 14px 20px;
    display: inline-block;
    text-decoration: none;
    float: left;
    font-size: 14px;
    color: #333;
    font-weight: 400;
    background-color: rgba(255, 255, 255, 0.9);
    -webkit-transition: color 0.3s, background 0.3s;
    transition: color 0.3s, background 0.3s;
}

.nav-dropdown>li:hover>a,
.nav-dropdown>li.focus>a {
    color: #0089cf;
    background: #fff;
}

.nav-dropdown.nav-dropdown-left {
    right: 0;
}

.nav-dropdown>li>.nav-dropdown-left {
    left: auto;
    right: 100%;
}

.navigation-landscape .nav-dropdown.nav-dropdown-left>li>a {
    text-align: left;
}

.navigation-portrait .nav-dropdown>li>a {
    padding: 12px 20px 12px 30px;
}

.navigation-portrait .nav-dropdown>li>ul>li>a {
    padding-left: 50px;
}

.navigation-portrait .nav-dropdown>li>ul>li>ul>li>a {
    padding-left: 70px;
}

.navigation-portrait .nav-dropdown>li>ul>li>ul>li>ul>li>a {
    padding-left: 90px;
}

.navigation-portrait .nav-dropdown>li>ul>li>ul>li>ul>li>ul>li>a {
    padding-left: 110px;
}

.nav-dropdown .submenu-indicator {
    right: 10px;
    top: 14px;
    position: absolute;
}

.navigation-portrait .nav-dropdown .submenu-indicator {
    right: 0;
    top: 0;
}

.nav-dropdown .submenu-indicator .submenu-indicator-chevron {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.navigation-portrait .nav-dropdown .submenu-indicator .submenu-indicator-chevron {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.nav-dropdown .submenu-indicator-chevron {
    border-color: transparent #333 #333 transparent;
}

.nav-dropdown>li:hover>a .submenu-indicator-chevron,
.nav-dropdown>.focus>a .submenu-indicator-chevron {
    border-color: transparent #0089cf #0089cf transparent;
}

.navigation-landscape .nav-dropdown.nav-dropdown-left .submenu-indicator {
    left: 6px;
}

.navigation-landscape .nav-dropdown.nav-dropdown-left .submenu-indicator .submenu-indicator-chevron {
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
}

/* HORIZONTAL DROPDOWN EXTENSION */
.nav-dropdown-horizontal {
    width: 100%;
    left: 0;
    background-color: #fdfdfd;
    border-top: solid 1px #f0f0f0;
}

.nav-dropdown-horizontal .nav-dropdown-horizontal {
    width: 100%;
    top: 100%;
    left: 0;
}

.navigation-portrait .nav-dropdown-horizontal .nav-dropdown-horizontal {
    border-top: none;
}

.nav-dropdown-horizontal>li {
    width: auto;
    clear: none;
    position: static;
}

.navigation-portrait .nav-dropdown-horizontal>li {
    width: 100%;
}

.nav-dropdown-horizontal>li>a {
    position: relative;
}

.nav-dropdown-horizontal .submenu-indicator {
    height: 18px;
    top: 11px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.navigation-portrait .nav-dropdown-horizontal .submenu-indicator {
    height: 42px;
    top: 0;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.navigation-portrait .nav-dropdown-horizontal .submenu-indicator.submenu-indicator-up {
    -webkit-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.navigation-landscape .nav-menu:not(.nav-menu-social)>li:not(.icon-item)>a {
    height: 66;
    padding: 30px 10px 10px;
    border-top: solid 3px transparent;
    -webkit-transition: color 0.3s, background 0.3s, border 0.3s;
    transition: color 0.3s, background 0.3s, border 0.3s;
}

.navigation-landscape .nav-menu:not(.nav-menu-social)>li:not(.icon-item):hover>a,
.navigation-landscape .nav-menu:not(.nav-menu-social)>li:not(.icon-item).active>a,
.navigation-landscape .nav-menu:not(.nav-menu-social)>li:not(.icon-item).focus>a {
    border-top-color: #0089cf;
}

.main-nav,
.main-nav * {
    list-style-type: none;
}

.main-nav a {
    text-decoration: none;
}

ul.main-nav li {
    line-height: 50px;
    text-transform: uppercase;
    font-weight: 400;
    float: left;
    position: relative;
    font-size: 14px;
}

ul.main-nav li a {
    color: rgb(255, 255, 255);
    padding: 0 9px;
    display: block;
    transition: .1s all ease-in-out;
    -webkit-transition: .1s all ease-in-out;
    -moz-transition: .1s all ease-in-out;
    padding-top: 15px;
}

ul.main-nav li ul li a {
    color: rgb(3, 3, 3);
    padding: 0 9px;
    display: block;
    transition: .1s all ease-in-out;
    -webkit-transition: .1s all ease-in-out;
    -moz-transition: .1s all ease-in-out;
}

ul.main-nav li a:hover,
ul.main-nav li a.active {
    color: #0089cf;
    border-top: 2px solid #0089cf;
    background-color: rgb(255, 255, 255)
}

ul.main-nav li:nth-child(5) ul,
ul.main-nav li:last-child ul {
    right: 0;
    left: auto;
}

ul.main-nav li ul {
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 99;
    background: rgba(255, 255, 255, 0.9);
    width: 250px;
    display: none;
    box-shadow: 0px 5px 20px 5px rgba(43, 43, 43, 0.4);
    padding: 0;
}

ul.main-nav li ul li {
    float: none;
    line-height: normal;
    border-top: 1px solid #bdbbbb;
    text-transform: capitalize;
}

ul.main-nav li ul li a {
    padding: 12px 15px;
    border: 0;
}

ul.main-nav li ul li a:hover {
    border: 0;
}

ul.main-nav li ul li a:after {
    display: none;
}

ul.main-nav li:hover>ul {
    display: block;
}

ul.main-nav li:hover>ul ul {
    left: 100%;
    top: -1px;
}

ul.main-nav>li:nth-last-child(2):hover>ul {
    right: 0;
    left: auto;
}

ul.main-nav>li:nth-last-child(2):hover>ul ul {
    right: 100%;
    left: auto;
}

/*Home Slider*/
.hades.tparrows.tp-rightarrow::before {
    content: "\f105";
}

.hades.tparrows.tp-rightarrow::before {
    content: "\f105";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    line-height: 50px;
}

.hades.tparrows.tp-rightarrow:hover::before {
    border-radius: 100%;
    background: rgba(255, 255, 255, 0.9);
}

.hades.tparrows.tp-leftarrow::before {
    content: "\f104";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    line-height: 50px;
}

.hades.tparrows.tp-leftarrow:hover::before {
    border-radius: 100%;
    background: rgba(255, 255, 255, 0.9);
}

.hades.tparrows {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    line-height: 50px;
}

.hades .tp-arr-allwrapper {
    width: 50px;
    height: 50px;
}


.hades .tp-arr-allwrapper {
    position: absolute;
    right: 0;
    left: auto;
    top: -100%;
}

.rev_slider .slotholder::after,
.rev_slider .slotholder .kenburnimg img::after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    z-index: 99;
    background: rgba(0, 0, 0, .35);
}

.home-icons {
    padding: 40px 0;
    position: relative;
}

.home-icons .icon:before {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    border-radius: 100%;
    background-color: white;
    top: 0;
    left: 0;
    z-index: -1;
}

.home-icons .icon:after {
    content: '';
    position: absolute;
    height: 40px;
    width: 2px;
    background-color: #dedadb;
    top: -40px;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: -1;
}

.home-icons .icon {
    position: relative;
    width: 100%;
    height: 255px;
    margin: 0 auto;
    border: solid 2px #d9d9d9;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    background: rgb(255, 255, 255);
    background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, #eef8fd 100%);
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}

.home-icons .icon:hover {
    width: 100%;
    height: 255px;
    margin: 0 auto;
    border: solid 2px #d9d9d9;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    background: rgba(19, 147, 220, 1);
    -webkit-transition: all 1000ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}

.home-icons .icon img {
    max-width: 100px;
    margin: 0 auto;
}

.home-icons .icon:hover img:not(.on-hover) {
    display: none;
}

.home-icons .icon:hover img.on-hover {
    display: block;
}

.home-icons .icon .on-hover {
    display: none;
}

.home-icons h2 {
    margin: 20px 0;
    font-size: 18px;
    color: #58595b;
    position: relative;
}

.home-icons h2:before {
    content: '';
    bottom: -9px;
    left: 0;
    right: 0;
    margin: 0 auto;
    height: 1px;
    width: 45px;
    background-color: #58595b;
    position: absolute;
    z-index: 1;
    opacity: 0.4;
}

.home-icons h2:after {
    content: '';
    bottom: -12px;
    left: 0;
    right: 0;
    margin: 0 auto;
    height: 1px;
    width: 45px;
    background-color: #58595b;
    position: absolute;
    z-index: 1;
    opacity: 0.4;
}

.home-icons a {
    color: #58595b;
    text-decoration: none;
    transition: all 0.3s ease;
}

.home-icons a:hover {
    color: #0089cf;
}

.home-icons:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 4px;
    background-color: #dedadb;
    top: calc(50% - 40px);
    left: 0;
    z-index: -1;
}

.featured-section {
    background-color: #0089cf;
    color: #fff;
    text-align: justify;
    width: 100vw;
}
.featured-section h1{
	color:#fff !important;
	font-weight:600 !important;
}

.featured-section a {
    color: white;
}

.featured-section a i {
    font-size: 28px;
    transform: translateY(4px);
}

.featured-section a:hover {
    color: rgba(0, 0, 0, 0.8);
}

.black-line {
    position: relative;
    width: 100%;
    height: 1px;
    background-color: #59595b;
    margin: 15px 0;
}

.black-line:before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 25px;
    height: 3px;
    background-color: #59595b;
}

.black-line:after {
    content: '';
    position: absolute;
    top: -1px;
    left: 25px;
    width: 25px;
    height: 3px;
    background-color: #fff;
}

.blue-line {
    position: relative;
    width: 100%;
    height: 1px;
    background-color: rgb(205, 205, 205);
    margin: 15px 0;
}

.blue-line:before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 25px;
    height: 3px;
    background-color: #59595b;
}

.blue-line:after {
    content: '';
    position: absolute;
    top: -1px;
    left: 25px;
    width: 25px;
    height: 3px;
    background-color: #0089cf;
}

.blue-line-center {
    position: relative;
    max-width: 350px;
    height: 1px;
    background-color: rgb(205, 205, 205);
    margin: 15px auto;
}

.blue-line-center:before {
    content: '';
    position: absolute;
    top: -1px;
    left: calc(50% - 20px);
    width: 25px;
    height: 3px;
    background-color: #59595b;
}

.blue-line-center:after {
    content: '';
    position: absolute;
    top: -1px;
    left: calc(50% + 5px);
    width: 25px;
    height: 3px;
    background-color: #0089cf;
}

.fixed-bg {
    width: 100%;
    overflow: hidden;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;

    color: white;
}

.fixed-bg h2 {
    font-weight: 600;
    color: #fff;
}

.fixed-bg h2 span {
    font-weight: 300;
}

.gradient-blue {
    padding: 90px 0;
    width: 100%;
    overflow: hidden;
    background: rgb(0, 137, 207);
    background: linear-gradient(90deg, rgba(6, 94, 155, 0.95) 0%, rgba(6, 94, 155, 0.8) 43%, rgba(0, 137, 207, 0) 84%);
}

a.blue-btn-xl {
    line-height: 50px;
    color: #fff;
    font-size: 16px;
    padding: 0 20px;
    display: inline-block;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #0089cf;
    margin-top: 40px;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 230px;
    transition: ease 0.2s all;
}

a.blue-btn-xl img {
    max-width: 30px;
}

a.blue-btn {
    line-height: 50px;
    color: #fff;
    font-size: 16px;
    padding: 0 25px;
    display: inline-block;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #0089cf;
    margin-top: 40px;
    display: -ms-inline-flex;
    display: -webkit-inline-flex;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: ease 0.2s all;
}

a.blue-btn:hover,
a.blue-btn-xl:hover {
    background-color: #cce6f8;
    color: #0089cf;
}

a.blue-btn-xl:hover img {
    filter: invert(60%);
}

.counters .card {
    border: 0;
    background-color: rgba(255, 255, 255, 0.4);
}

.counters .counter-box {
    max-width: 140px;
    position: relative;
}

.counters span.counter {
    position: absolute;
    left: 0;
    top: 60px;
    right: 0;
    width: 100%;
    color: #1b4c6f;
    font-weight: bold;
    font-size: 30px;
    text-align: center;
    z-index: 10 !important;
}

.flame-bg {
    background-image: url(../images/bg/footer_bg.png);
    background-repeat: no-repeat;
    background-position: center right;
    background-size: contain;
}

.latest-news .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.latest-news .swiper-container {
    overflow: unset;
}

.latest-news .container {
    overflow: hidden;
}

.news {
    text-align: left;
    border: 0;
}

.img-box {
    position: relative;
}

.news h4 a {
    color: rgb(88, 89, 91);
    font-weight: normal;
}

.news p {
    color: rgb(167, 167, 167);
    font-size: 14px;
}

.news .card-body {
    padding: 1rem 0;
}

.news .card-img {
    border-radius: 0;
    border-bottom: solid 5px #0089cf
}

.news .hover {
    width: 100%;
    height: 100%;
    background: 0 0;
    padding-top: 25%;
    position: absolute;
    top: 0;
    left: 0;
    transition: all .3s ease 0s;
    text-align: center;
    overflow: hidden;
}

.news:hover .hover {
    background: rgba(0, 137, 207, 0.3);
}

.news .hover a {
    transition: all .6s cubic-bezier(.175, .885, .32, 1.275) 0s;
    display: block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 24px;
    color: rgb(88, 89, 91);
    background-color: #fff;
    position: relative;
    border-radius: 100%;
    text-align: center;
    margin: 0 auto;
    top: -100%;
}

.news .hover:hover a {
    top: 0;
}

.news .date {
    position: absolute;
    top: 20%;
    right: -20px;
    width: 90px;
    background-color: #0089cf;
    color: #fff;
    text-align: center;
    padding: 15px 15px 10px;
    font-size: 30px;
    font-weight: 600;
    z-index: 2;

}

.news:hover .date {
    background-color: rgb(88, 89, 91)
}

.news .date span {
    font-size: 13px;
    font-weight: 300;
    display: block;
}

.swiper-slide-prev .date {
    right: 0;
}

.latest-news .swiper-container-horizontal>.swiper-pagination-bullets {
    bottom: -25px;
}

.page-banner {
    position: relative;
    height: 350px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.page-banner:before {
    content: "";
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.36);
}

.page-title {
    border-bottom: solid 1px rgb(233, 233, 233);
}

.page-title .breadcrumb {
    margin: 0;
    background-color: transparent;
}

.page-title .breadcrumb li {
    font-size: 13px;
}

.page-title h3 {
    color: rgb(88, 89, 91);
    font-size: 22px;
    margin: 0;
    font-weight: 400;
}

.title {
    font-size: 30px;
    color: #258bd5 !important;
    font-weight: 300;
}


.value-items {
    text-align: center;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 100px;
}

.value-item-wrapper {
    margin-bottom: 120px;
    padding-left: 27px;
    padding-right: 27px;
}

.value-item {
    height: calc(100% - 20px);
}

.value-item.value-has-link~.value-fix-bottom-padding.value-fix-feature-arrow-button-height {
    position: relative;
    display: block;
    width: 100%;
    height: 30px;
}

.value-with-image .value-item .ripple:before {
    content: "";
    position: absolute;
    top: -74px;
    left: 50%;
    margin-left: -74px;
    width: 148px;
    height: 148px;
    border-radius: 1000px;
    z-index: 10;
}

.value-item .ripple::after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 50%;
    margin-left: -25px;
    width: 50px;
    height: 50px;
    border-radius: 1000px;
    z-index: 10;
    animation: rippleMe 0.7s linear infinite;
    box-shadow: 5px 5px 10px rgba(163, 177, 198, 0.6), -5px -5px 10px rgba(255, 255, 255, 0.5);
    background-image: inherit;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70%;
}

@keyframes rippleMe {
    0% {
        box-shadow: 0 0 0 0 rgba(163, 177, 198, 0.3), 0 0 0 1em rgba(163, 177, 198, 0.3), 0 0 0 3em rgba(163, 177, 198, 0.03), 0 0 0 5em rgba(163, 177, 198, 0.01);
    }

    100% {
        box-shadow: 0 0 0 1em rgba(163, 177, 198, 0.3), 0 0 0 3em rgba(163, 177, 198, 0.03), 0 0 0 5em rgba(163, 177, 198, 0.03), 0 0 0 8em rgba(163, 177, 198, 0.01);
    }
}



.value-item .value-item-inner {
    padding: 50px 30px;
    border-radius: 6px;
    z-index: 5;
    position: relative;
    height: 100%;
}

.value-item .value-item-inner {
    padding-top: 60px;
    padding-bottom: 60px;
}

.value-item .value-item-inner:before {
    border: 0;
    box-shadow: 120px 0px 150px rgba(80, 80, 80, 0.15),
        10px 0px 10px rgba(80, 80, 80, 0.02);
    border-radius: 1000px;
    background: rgba(255, 255, 255, 0);
    background: -moz-linear-gradient(left,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 40%,
        rgba(255, 255, 255, 1) 100%);
    background: -webkit-gradient(left top,
        right top,
        color-stop(0%, rgba(255, 255, 255, 0)),
        color-stop(40%, rgba(255, 255, 255, 0)),
        color-stop(100%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(left,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 40%,
        rgba(255, 255, 255, 1) 100%);
    background: -o-linear-gradient(left,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 40%,
        rgba(255, 255, 255, 1) 100%);
    background: -ms-linear-gradient(left,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 40%,
        rgba(255, 255, 255, 1) 100%);
    background: linear-gradient(to right,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0) 40%,
        rgba(255, 255, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=1);
}

.value-item .value-item-inner:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.value-right-border {
    position: absolute;
    width: calc(100% + 24px);
    height: calc(100% + 24px);
    top: -12px;
    left: 50%;
    overflow: hidden;
}

.value-right-border:before,
.value-hovering-features .value-item a:hover~.value-item-inner .value-right-border:before {
    border: 11px solid #2f53bf;
}

.value-right-border:before,
.value-hovering-features .value-item a:hover~.value-item-inner .value-right-border:before,
.value-hovering-features-grey .value-item a:hover~.value-item-inner .value-right-border:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: 11px solid #258bd5;
    border-radius: 800px;
    left: -50%;
}

.value-item .value-block-content-wrapper {
    position: relative;
    display: block;
    text-decoration: none;
    margin: -30px;
    padding: 40px 5px;
    height: calc(100% + 100px);
    font-size: 15px;
}

.values-design-2 .value-item-wrapper {
    margin-bottom: 120px;
    padding-left: 27px;
    padding-right: 27px;
}

.value-item.value-has-link .value-item-inner:after {
    content: "";
    background-color: #fff;
    z-index: 6;
    position: absolute;
    background-repeat: no-repeat;
    background-position: center center;
}

.value-icon-wrapper {
    width: 148px;
    height: 148px;
    line-height: 148px;
    border-radius: 500px;
    position: relative;
    background-color: #fff;
    box-shadow: 8px 8px 30px rgba(0, 0, 0, 0.06);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 50%;
    vertical-align: middle;
    margin-left: -74px;
    top: -66px;
    margin-top: -74px;
}

.value-icon-inner {
    width: 120px;
    height: 120px;
    line-height: 120px;
    border-radius: 500px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.14);
    background: #fff;
    transform: translateY(-3px);
}

.value-icon-inner div {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    display: inline-block;
    position: relative;
    width: 120px;
    height: 120px;
    line-height: 120px;
    text-align: left;
    overflow: hidden;
    border-radius: 100%;
}

.value-icon-inner img {
    position: relative;
    margin: 0 auto;
    vertical-align: middle;
    display: inline-block;
    height: 130px;
    left: 50%;
    -webkit-transform: translate(-50%);
    -moz-transform: translate(-50%);
    -ms-transform: translate(-50%);
    -o-transform: translate(-50%);
    transform: translate(-50%);
}

.value-item img,
.value-item i {
    position: relative;
    display: inline-block;
    border-bottom: 0;
    font-size: 40px;
    top: 0;
    padding: 0;
    color: #258bd5;
}

.value-with-image .value-content-wrapper {
    top: 0;
}

.value-content-wrapper {
    position: relative;
    margin-top: -45.5px;
}

.value-item .value-item-title {
    padding-top: 0;
    margin: 0 0 30px;
    text-align: center;
    line-height: 1.5;
}

.value-item .value-item-title.value-counter-added>span {
    margin-left: 25px;
    border-radius: 0 50px 50px 0;
}

.value-item .value-item-title>span {
    box-shadow: 15px 20px 30px rgba(80, 80, 80, 0.12),
        5px 0px 40px rgba(80, 80, 80, 0.1);
    padding: 10px 20px;
    display: inline-block;
    position: relative;
    background-color: #fff;
}

.value-item .value-item-title>span span {
    box-shadow: 15px 15px 30px rgba(80, 80, 80, 0.2),
        5px 0px 80px rgba(80, 80, 80, 0.15);
    padding: 10px 0;
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 30px;
    white-space: nowrap;
    position: absolute;
    top: -3px;
    left: -40px;
    border-radius: 50px;
    background-color: #fff;
}

.value-item .value-item-title span {
    display: inline-block;
    font-size: 14px;
    line-height: normal;
    font-weight: 400;
    text-shadow: none;
    border-radius: 50px;
    color: #252525;
    font-size: 18px;
}

.value-item-excerpt {
    padding: 0 20px;
}

.value-item-excerpt {
    color: #252525;
    position: relative;
    top: 0;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.value-item-excerpt ul {
    padding: 0;
    text-align: left;
}

.value-with-image .value-item a:before {
    content: "";
    position: absolute;
    top: -74px;
    left: 50%;
    margin-left: -74px;
    width: 148px;
    height: 148px;
    border-radius: 1000px;
    z-index: 10;
}

.value-item.value-has-link .value-item-inner:after {
    margin-left: -25px;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    box-shadow: 10px 10px 40px rgba(80, 80, 80, 0.15),
        15px 15px 30px rgba(80, 80, 80, 0.05), 0 0 120px rgba(80, 80, 80, 0.6);
    bottom: -30px;
    background-size: 40%;
    color: #555;
    line-height: 52px;
}

.gray-gradient {
    background: rgba(229, 229, 229, 1);
    background: -moz-linear-gradient(top, rgba(229, 229, 229, 1) 0%, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(229, 229, 229, 1)), color-stop(20%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(top, rgba(229, 229, 229, 1) 0%, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 1) 100%);
    background: -o-linear-gradient(top, rgba(229, 229, 229, 1) 0%, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 1) 100%);
    background: -ms-linear-gradient(top, rgba(229, 229, 229, 1) 0%, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 1) 100%);
    background: linear-gradient(to bottom, rgba(229, 229, 229, 1) 0%, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#ffffff', GradientType=0);
    padding: 50px 0;
}

.key-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    background: rgba(68, 188, 253, 1);
    background: -moz-linear-gradient(left, rgba(68, 188, 253, 1) 0%, rgba(24, 118, 172, 1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(68, 188, 253, 1)), color-stop(100%, rgba(24, 118, 172, 1)));
    background: -webkit-linear-gradient(left, rgba(68, 188, 253, 1) 0%, rgba(24, 118, 172, 1) 100%);
    background: -o-linear-gradient(left, rgba(68, 188, 253, 1) 0%, rgba(24, 118, 172, 1) 100%);
    background: -ms-linear-gradient(left, rgba(68, 188, 253, 1) 0%, rgba(24, 118, 172, 1) 100%);
    background: linear-gradient(to right, rgba(68, 188, 253, 1) 0%, rgba(24, 118, 172, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#44bcfd', endColorstr='#1876ac', GradientType=1);
    padding: 2px;
    margin: 0 auto;
    margin-bottom: 15px;
    line-height: 50px;
    position: relative;
    transition: ease 0.5s all;
}

.key-icon:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 56px;
    height: 56px;
    border-radius: 100%;
    background-color: #fff;
}

.key-icon:hover:after {
    background-color: transparent;
}

.key-icon img {
    position: relative;
    z-index: 2;
    transition: ease 0.2s all;
}

.key-icon:hover img {
    filter: brightness(0%) invert(1);
}

.our-buyers .logo-box {
    min-height: 150px;
}

.our-buyers .d-flex.align-items-start.text-center>div {
    margin: 0 5px;
    padding: 0 10px;
}

.our-buyers .d-flex.align-items-start.text-center>div:hover {
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.08);
    z-index: 2;
    -webkit-transition: all 400ms ease-in;
    -webkit-transform: scale(1.1);
    -ms-transition: all 400ms ease-in;
    -ms-transform: scale(1.1);
    -moz-transition: all 400ms ease-in;
    -moz-transform: scale(1.1);
    transition: all 400ms ease-in;
    transform: scale(1.1);
    background-color: #fff;
}

.our-buyers h6 {
    color: #0089cf;
}

.our-buyers h4 {
    color: rgb(142, 144, 149);
    font-size: 28px
}

.separator {
    background: url(../images/bg/separator_bg.png) no-repeat center bottom rgba(246, 246, 246, 0.5);
    padding: 30px 0 60px 0;
}

.profile-img {
    min-height: 200px;
    border-radius: 100%;
    border: solid 8px rgb(154, 154, 154);
    overflow: hidden;
    transition: all 400ms ease-out;
}

.profile-img.active {
    border-color: rgba(0, 137, 207, 0.7)
}

.profile-img:hover {
    border: solid 8px #0089cf;
}

.profile-img img {
    width: 100%;
}

.member_separator {
    background-image: url(../images/bg/member_separator_bg.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    min-height: 30px;
    transform: translateY(-40px);
    position: relative;
}

.member_separator:before {
    position: absolute;
    content: '';
    width: 100%;
    height: 20px;
    background-color: #fff;
    bottom: -15px;
    left: 0;
}

.title-with-line {
    position: relative;
    margin-bottom: 20px;
}

.title-with-line:before {
    content: '';
    position: absolute;
    bottom: -10px;
    width: 50%;
    height: 2px;
    background-color: #0089cf;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.team-carousel {
    max-height: 850px;
}

.team-carousel .swiper-slide {
    text-align: center;
    margin-top: 0 !important;
    width: 20%;
    height: 390px !important;
    position: relative;
    transition-property: transform;
    margin-left: 40px;
}

.team-carousel .swiper-container {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}


.team-carousel .swiper-slide h6 {
    position: relative;
    margin-bottom: 20px;
}

.team-carousel .swiper-slide h6:before {
    content: '';
    position: absolute;
    bottom: -10px;
    width: 50%;
    height: 2px;
    background-color: #0089cf;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.team-carousel.swiper-container-multirow-column>.swiper-wrapper {
    flex-wrap: wrap;
    flex-direction: row;
}

.team-carousel>.swiper-pagination-bullets {
    bottom: -30px;
    padding-bottom: 25px;
}

.container.position-relative .swiper-button-next {
    right: -20px;
}

.container.position-relative .swiper-button-prev {
    left: -20px;
}

.team .swiper-button-next {
    left: -20px;
    transform: translateY(35px) rotate(90deg);
}

.team .swiper-button-prev {
    left: -20px;
    transform: rotate(90deg);
}

.team .swiper-container-vertical>.swiper-pagination-bullets {
    right: 10px;
    top: 68%;
    transform: translate3d(0px, -50%, 0);
}

.profile {
    box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15) !important;
    padding: 10px 20px;
    display: inline-block;
    position: relative;
    background-color: #fff;
    border-radius: 25px;
    margin-bottom: 40px;
    margin-top: 20px;
    cursor: pointer;
}

.designation {
    color: #999;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 40px;
}

.modal-body img {
    width: 100%;
    border-radius: 100%;
    box-shadow: 0px 5px 25px rgba(80, 80, 80, 0.12), 5px 0px 15px rgba(80, 80, 80, 0.1);
    border: solid 2px #0089cf;
    background: aliceblue;
}

.half-circle-bg {
    background-image: url('../images/bg/half_circle_bg.svg');
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

.fadeContainer {
    width: 100%;
    min-height: 335px;
    position: relative;
}

.fadeContainer img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

/*
.fadeContainer::before,
.fadeContainer::after {
    content: '';
    display: block;
    position: absolute;
    border-color: rgb(0, 137, 207);
    box-sizing: border-box;
    border-style: solid;
    width: 2em;
    height: 2em;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.fadeContainer::before {
    top: -9px;
    left: -9px;
    border-width: 2px 0 0 2px;
    z-index: 5;
}

.fadeContainer::after {
    bottom: -9px;
    right: -9px;
    border-width: 0 2px 2px 0;
}

.fadeContainer:hover::before,
.fadeContainer:hover::after {
    width: calc(100% + 28px);
    height: calc(100% + 28px);
    border-color: rgb(0, 137, 207);
}

.fadeContainer:hover::before,
.fadeContainer:hover::after {
    width: calc(100% + 28px);
    height: calc(100% + 28px);
    border-color: rgb(0, 137, 207);
}

.fadeContainer:hover {
    border-color: rgb(0, 137, 207);
    border-width: 2px;
    -webkit-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}
*/
/* animation styles */
@keyframes fadeInImage {
    0% {
        opacity: 0;
    }

    20% {
        opacity: 0;
    }

    60% {
        opacity: 1;
    }

    100% {
        opacity: 1;
    }
}

.fadeInClass {
    animation-name: fadeInImage;
    animation-duration: 7s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: linear;
}

.blue-color,
.blue-color a {
    color: #0089cf;
}

.sub-title {
    font-weight: 300;
    font-size: 24px;
    margin-bottom: 15px;
}

.border-img {
    width: 100%;
    height: 100%;
    min-height: 250px;
    position: relative;
    border: solid 2px transparent;
    box-shadow: 8px 8px 30px rgba(0, 0, 0, 0.06);
}

.border-img img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.border-img::before,
.border-img::after {
    content: '';
    display: block;
    position: absolute;
    border-color: rgb(0, 137, 207);
    box-sizing: border-box;
    border-style: solid;
    width: 2em;
    height: 2em;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.border-img::before {
    top: -9px;
    left: -9px;
    border-width: 2px 0 0 2px;
    z-index: 5;
}

.border-img::after {
    bottom: -9px;
    right: -9px;
    border-width: 0 2px 2px 0;
}

.lines-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999;
    pointer-events: none;
}

.lines-wrapper span.vertical {
    position: absolute;
    height: 1px;
    width: 100%;
    background: white;
    top: 12%;
    left: 0;
    z-index: 1;
    opacity: 0.05;
}

.lines-wrapper .croses span {
    color: white;
    font-size: 1rem;
    position: absolute;
    top: 11%;
    left: calc(20% - 2px);
}

.lines-wrapper .croses span:nth-child(2) {
    left: calc(40% - 2px);
}

.lines-wrapper .croses span:nth-child(3) {
    left: calc(60% - 2px);
}

.lines-wrapper .croses span:nth-child(4) {
    left: calc(80% - 2px);
}

.lines-wrapper span.horizontal {
    position: absolute;
    width: 1px;
    height: 100%;
    background: white;
    z-index: 1;
    left: 20%;
    opacity: 0.05;
}

.lines-wrapper span.horizontal:nth-child(2) {
    left: 40%;
}

.lines-wrapper span.horizontal:nth-child(3) {
    left: 60%;
}

.lines-wrapper span.horizontal:nth-child(4) {
    left: 80%;
}

.slider-content {
    position: relative;
    max-width: 112rem;
    min-width: 480px;
    background: #fff;
    margin: 0 auto;
}

.slider-content .slider-container {
    position: relative;
    height: 38rem;
}

.slider-content .slide-content {
    position: absolute;
    width: 100%;
    height: 100%;
}

.slider-content .slide {
    position: absolute;
    width: 100%;
    height: 100%;
    background-blend-mode: multiply;
    background-size: auto 125%;
    background-position: 0px -45px;
    background-repeat: no-repeat;
    opacity: 0;
}

.slider-content .slide:after {
    content: "";
    display: table;
    clear: both;
}

.slider-content .slide.active {
    opacity: 1;
    z-index: 50;
}

.slider-content .slide.next {
    opacity: 1;
}

.slider-content .slide.blue-light1 {
    background-color: #eef6fd;
}

.slider-content .slide.blue-light2 {
    background-color: #cde8f9;
}

.slider-content .slide.blue-light3 {
    background-color: #addaf5;
}

.slider-content .slide.blue-light4 {
    background-color: #cde8f9;
}

.slider-content .canvas {
    position: absolute;
    left: 0;
    top: 0;
}

.slider-content .fake-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-blend-mode: multiply;
    background-size: auto 125%;
    background-position: 0px -45px;
    background-repeat: no-repeat;
}


.slider-content .image-mask {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 125%;
    overflow: hidden;
}

.slider-content .image-mask img {
    position: absolute;
    display: block;
    width: auto;
    height: 100%;
    top: -45px;
}

.slider-content .mask-animation {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0rem;
    left: -5rem;
}

.slider-content .mask-animation img.clip {
    width: 100%;
    -webkit-clip-path: url(#svgPathBig);
    clip-path: url(#svgPathBig);
}

.slider-content .image-caption {
    position: absolute;
    color: #0089cf;
    top: 6rem;
    left: 5rem;
    font-size: 1.3rem;
    z-index: 10;
    display: inline-block;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.slider-content .image-caption h4 {
    font-weight: 300;
    font-size: 34px;
}

.slider-content .image-caption.mask-up {
    clip: rect(0rem, 0rem, 12rem, 0px);
}

.slider-content .image-caption.mask-down {
    clip: rect(0rem, 21rem, 2rem, 200px);
}

.slider-content .image-caption span {
    display: inline-block;
    vertical-align: top;
}

.slider-content .image-caption .line {
    position: relative;
    background: #0089cf;
    height: 1px;
    width: 5rem;
    top: 1rem;
}

.slider-content .title-background {
    position: absolute;
    font-size: 25rem;
    top: 8rem;
    left: 4rem;
    color: black;
    opacity: 0.03;
}

.slider-content .title-background span.mask-wrap {
    display: block;
    height: 25rem;
    position: relative;
}

.slider-content .title-background span.mask-wrap span.mask {
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(0rem, 120rem, 25rem, 0px);
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}

.slider-content .title-background span.mask-wrap:last-child span.mask {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
}

.slider-content .title-background span.mask-wrap.mask-up span.mask {
    clip: rect(0rem, 120rem, 0rem, 0px);
}

.slider-content .title-background span.mask-wrap.mask-down span.mask {
    clip: rect(25rem, 44rem, 25rem, 0px);
}

.slider-content .title-wrapper {
    position: relative;
    color: #2f2f2f;
    margin-left: auto;
    margin-right: auto;
    width: 85%;
    margin-top: 13rem;
    z-index: 5;
}

.slider-content .title-wrapper img {
    width: 100%;
}

.slider-content .title-wrapper h1 {
    font-size: 12rem;
    margin: 0;
    line-height: 1;
    margin-bottom: 1rem;
    font-weight: 900;
    text-align: right;
    margin-left: 5rem;
}

.slider-content .title-wrapper h1 span.mask-wrap {
    display: block;
    height: 12rem;
    position: relative;
}

.slider-content .title-wrapper h1 span.mask-wrap span.mask {
    position: absolute;
    top: 0;
    right: 0;
    clip: rect(0rem, 48rem, 12rem, 0px);
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}

.slider-content .title-wrapper h1 span.mask-wrap:last-child span.mask {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
}

.slider-content .title-wrapper h1 span.mask-wrap.mask-up span.mask {
    clip: rect(0rem, 44rem, 0rem, 0px);
}

.slider-content .title-wrapper h1 span.mask-wrap.mask-down span.mask {
    clip: rect(12rem, 44rem, 12rem, 0px);
}

.slider-content .title-wrapper span.gallery {
    position: relative;
    text-align: right;
    padding: 0 2rem;
    cursor: pointer;
    margin-right: 5rem;
}

.slider-content .title-wrapper span.gallery::before {
    content: "";
    position: absolute;
    left: -2rem;
    display: block;
    width: 1px;
    height: 2.5rem;
    background: white;
    top: -0.5rem;
    opacity: 0.9;
}

.slider-content .title-wrapper span.gallery::after {
    content: "";
    position: absolute;
    right: -2rem;
    display: block;
    width: 1px;
    height: 2.5rem;
    background: white;
    top: -0.5rem;
    opacity: 0.9;
}

.control-nav {
    position: absolute;
    right: 3rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 999;
}

.control-nav ul {
    position: relative;
    list-style: none;
    padding: 0;
    display: none;
}

.control-nav li {
    position: relative;
    margin: 0.2rem 0;
    opacity: 0.5;
    border-radius: 3rem;
    color: white;
    font-size: 3rem;
}

.control-nav li.active {
    opacity: 1;
}

.control-nav li.active .line {
    -webkit-transform: translateX(-1.2rem);
    transform: translateX(-1.2rem);
    width: 1.8rem;
}

.control-nav li.active .number {
    opacity: 1;
}

.control-nav .line {
    width: 1.5rem;
    height: 1px;
    display: block;
    position: absolute;
    top: 50%;
    background: white;
    left: -1rem;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.control-nav .number {
    position: relative;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}


.footer-wrapper {
    position: absolute;
    color: #2f2f2f;
    top: 0rem;
    right: 0rem;
    width: 90%;
    height: 4rem;
    z-index: 999;
}

.footer-wrapper ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: center;
    height: 100%;
}

.footer-wrapper ul:after {
    content: "";
    display: table;
    clear: both;
}

.footer-wrapper li {
    position: relative;
    float: left;
    width: 25%;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.1);

    height: 100%;
    border-right: 1px solid rgba(0, 0, 0, 0.2);
    cursor: pointer;
}

.footer-wrapper li:last-child {
    border: none;
}

.footer-wrapper li.active .hover-box {
    opacity: 1;
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
}

.footer-wrapper li .hover-box {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgb(0, 137, 207);
    top: 0;
    left: 0;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    z-index: 1;
}

.footer-wrapper li .box-content {
    position: relative;
    z-index: 5;
    font-size: 14px;
    line-height: 16px;
}

.footer-wrapper .circle {
    display: block;
    height: 35px;
    width: 35px;
    line-height: 35px;
    background-color: white;
    border-radius: 100%;
    color: #0089d0;
    box-shadow: 8px 8px 30px rgba(0, 0, 0, 0.2);
    margin: 0 auto;
}

.box.active {
    color: white;
}


.step-list {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.step-list__item {
    counter-increment: step-counter;
    position: relative;
}

.step-list__item__inner p {
    margin-bottom: 0;
}

.step-list__item__inner i {
    text-align: center;
    color: #0089cf;
    font-size: 16px;
}

.step-list__item:before {
    content: counter(step-counter);
    font-weight: 300;
    color: #d8d8d8;
}

.step-list__item h2 {
    font-size: 24px;
    line-height: 30px;
    font-weight: 300;
    color: #0089cf !important;
    margin-bottom: 15px;
}

.step-list__item .icon {
    border-radius: 50%;
    display: block;
    -webkit-box-flex: 0;
    flex: 0 0 auto;
}

.step-list__item .icon img {
    width: 100%;
    height: 100%;
}

.step-list__item .body {
    font-size: 12px;
    line-height: 18px;
    font-weight: 300;
    border: solid 1px rgba(128, 128, 128, 0.11);
    padding: 20px;
    background: rgba(215, 215, 215, 0.08);
}

.step-list__item .content {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
    padding-bottom: 18px;
}

.step-list__item:first-child .icon {
    background: #eef6fd;
}

.step-list__item:nth-child(2) .icon {
    background: #eef2f4;
}

.step-list__item:nth-child(3) .icon {
    background: #eef6fd;
}

.step-list__item:nth-child(4) .icon {
    background: #eef2f4;
}

.step-list__item:nth-child(5) .icon {
    background: #eef6fd;
}

.step-list__item:nth-child(odd) .content {
    -webkit-box-pack: start;
    justify-content: flex-start;
}

.step-list__item:nth-child(even) .content {
    -webkit-box-pack: end;
    justify-content: flex-end;
}

.step-list__item:first-child>.step-list__item__inner:before {
    content: none;
}

.step-list__item:last-child>.step-list__item__inner:after {
    content: none;
}

.step-list__item+li {
    margin-top: 84px;
}

.step-list__item+li>div {
    margin-top: -1px;
}

@media screen and (max-width: 600px) {
    .step-list__item {
        display: -webkit-box;
        display: flex;
    }

    .step-list__item:before {
        content: counter(step-counter);
        position: relative;
        font-size: 36px;
        line-height: 42px;
        font-weight: 300;
        color: #000000;
        margin-right: 12px;
    }

    .step-list__item .icon {
        -webkit-box-ordinal-group: 1;
        order: 0;
        width: 36px;
        height: 36px;
        padding: 9px;
        position: absolute;
        left: -9px;
        top: 42px;
    }

    .step-list__item .body {
        -webkit-box-ordinal-group: 2;
        order: 1;
        margin-top: 8px;
        margin-left: 12px;
    }

    .step-list__item .content {
        -webkit-box-align: start;
        align-items: flex-start;
    }

    .step-list__item .content:before {
        content: '';
        position: absolute;
        border-left: #d8d8d8;
        height: 100%;
        left: 9px;
        bottom: 0;
        display: block;
        width: 1px;
        background: #d8d8d8;
        top: 84px;
    }

    .step-list__item:last-child .content:before {
        content: none;
    }
}

@media screen and (min-width: 768px) {
    .step-list__item:before {
        content: counter(step-counter);
        position: absolute;
        font-size: 90px;
        line-height: 1;
        font-weight: 300;
        color: #d8d8d8;
    }

    .step-list__item .icon {
        width: 200px;
        height: 200px;
        padding: 30px;
    }

    .step-list__item .body {
        -webkit-box-flex: 0;
        flex: 0 1 33.3333%;
        margin-top: 84px;
    }

    .step-list__item .content {
        -webkit-box-align: end;
        align-items: flex-end;
    }

    .step-list__item>.step-list__item__inner {
        position: relative;
    }

    .step-list__item>.step-list__item__inner:before,
    .step-list__item>.step-list__item__inner:after {
        border-width: 0px;
        border-style: solid;
        border-color: #d8d8d8;
        display: block;
        content: '';
        position: absolute;
        height: 42px;
        width: calc(33.3333% - 42px);
    }

    .step-list__item:nth-child(odd)>.step-list__item__inner {
        text-align: right;
    }

    .step-list__item:nth-child(odd)>.step-list__item__inner:before,
    .step-list__item:nth-child(odd)>.step-list__item__inner:after {
        border-left-width: 1px;
        left: calc(33.3333% - 21px);
    }

    .step-list__item:nth-child(odd)>.step-list__item__inner:before {
        border-top-width: 1px;
        border-top-left-radius: 42px;
        margin-top: -42px;
    }

    .step-list__item:nth-child(odd)>.step-list__item__inner:after {
        border-bottom-width: 1px;
        border-bottom-left-radius: 42px;
        margin-bottom: -42px;
    }

    .step-list__item:nth-child(odd):before {
        left: 0;
        margin-left: 33.3333%;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }

    .step-list__item:nth-child(odd) .icon {
        margin-left: 72px;
    }

    .step-list__item:nth-child(even)>.step-list__item__inner:before,
    .step-list__item:nth-child(even)>.step-list__item__inner:after {
        border-right-width: 1px;
        right: calc(33.3333% - 21px);
    }

    .step-list__item:nth-child(even)>.step-list__item__inner:before {
        border-top-width: 1px;
        border-top-right-radius: 42px;
        margin-top: -42px;
    }

    .step-list__item:nth-child(even)>.step-list__item__inner:after {
        border-bottom-width: 1px;
        border-bottom-right-radius: 42px;
        margin-bottom: -42px;
    }

    .step-list__item:nth-child(even):before {
        right: 0;
        margin-right: 33.3333%;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }

    .step-list__item:nth-child(even) .icon {
        margin-right: 72px;
    }

    .step-list__item:nth-child(even) .body {
        -webkit-box-ordinal-group: 2;
        order: 1;
    }
}



.milestones-carousel {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    background-color: #fff;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    margin-top: 30px;
}

.milestones-carousel .title {
    font-size: 38px;
    color: #258bd5;
    font-weight: 300;
}

.timeline {
    width: 100%;
    background-color: #fff;
    box-shadow: 0 5px 25px 5px rgba(0, 0, 0, 0.2);
}

.timeline .swiper-container {
    height: 600px;
    width: 100%;
    position: relative;
}

.timeline .swiper-wrapper {
    -webkit-transition: 2s cubic-bezier(0.68, -0.4, 0.27, 1.34) 0.2s;
    transition: 2s cubic-bezier(0.68, -0.4, 0.27, 1.34) 0.2s;
}

.timeline .swiper-slide {
    position: relative;
    color: #fff;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.timeline .swiper-slide::after {
    content: "";
    position: absolute;
    z-index: 1;
    right: -115%;
    bottom: -10%;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    box-shadow: -230px 0 150px 60vw rgba(0, 0, 0, 0.7);
    border-radius: 100%;
}

.timeline .swiper-slide-content {
    position: absolute;
    text-align: center;
    width: 80%;
    max-width: 310px;
    right: 50%;
    top: 13%;
    -webkit-transform: translate(50%, 0);
    transform: translate(50%, 0);
    font-size: 12px;
    z-index: 2;
}

.timeline .swiper-slide .timeline-year {
    display: block;
    font-size: 42px;
    margin-bottom: 50px;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
    color: #0089cf;
    font-weight: 300;
    opacity: 0;
    -webkit-transition: .2s ease .4s;
    transition: .2s ease .4s;
}

.timeline .swiper-slide .timeline-title {
    font-weight: 800;
    font-size: 34px;
    color: #fff;
    margin: 0 0 30px;
    opacity: 0;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
    -webkit-transition: .2s ease .5s;
    transition: .2s ease .5s;
}

.timeline .swiper-slide .timeline-text {
    font-size: 15px;
    line-height: 1.5;
    opacity: 0;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
    -webkit-transition: .2s ease .6s;
    transition: .2s ease .6s;
}

.timeline .swiper-slide-active .timeline-year {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: .4s ease 1.6s;
    transition: .4s ease 1.6s;
}

.timeline .swiper-slide-active .timeline-title {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: .4s ease 1.7s;
    transition: .4s ease 1.7s;
}

.timeline .swiper-slide-active .timeline-text {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: .4s ease 1.8s;
    transition: .4s ease 1.8s;
}

.timeline .swiper-pagination {
    right: 15% !important;
    height: 70%;
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    font-style: italic;
    font-weight: 300;
    font-size: 18px;
    z-index: 11;
    overflow: hidden;
}

.timeline .swiper-pagination::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 0;
    height: 100%;
    width: 1px;
    background-color: rgba(255, 255, 255, 0.2);
}

.timeline .swiper-pagination-bullet {
    width: auto;
    height: auto;
    text-align: center;
    opacity: 1;
    background: transparent;
    color: #fff;
    margin: 15px 0 !important;
    position: relative;
    font-style: normal;
}

.timeline .swiper-pagination-bullet::before {
    content: "";
    position: absolute;
    top: 5px;
    left: -34.5px;
    width: 11px;
    height: 11px;
    border-radius: 100%;
    background-color: #5ca4cd;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .2s;
    transition: .2s;
}

.timeline .swiper-pagination-bullet-active {
    color: #5ca4cd;
}

.timeline .swiper-pagination-bullet-active::before {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.timeline .swiper-button-next,
.timeline .swiper-button-prev {
    /*background-size: 20px 20px;*/
    top: 15%;
   /* width: 20px;*/
    /*height: 20px;*/
    margin-top: 0;
    z-index: 20;
    -webkit-transition: .2s;
    transition: .2s;
}

.timeline .swiper-button-prev:hover {
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px);
}

.timeline .swiper-button-next:hover {
    -webkit-transform: translateX(3px);
    transform: translateX(3px);
}

.timeline .swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 80px;
    padding-left: 35px;
}

@media screen and (min-width: 768px) {
    .timeline .swiper-slide::after {
        right: -30%;
        bottom: -8%;
        width: 240px;
        height: 50%;
        box-shadow: -230px 0 150px 50vw rgba(0, 0, 0, 0.7);
    }

    .timeline .swiper-slide-content {
        right: 30%;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        max-width: 400px;
        font-size: 14px;
        text-align: right;
        width: 100%;
    }

    .timeline .swiper-slide .timeline-year {
        margin-bottom: 0;
        font-size: 32px;
    }

    .timeline .swiper-slide .timeline-title {
        font-size: 25px;
        margin: 15px 0 15px 0;
        color: #fff;
        text-shadow: 5px 4px 8px rgba(0, 0, 0, 0.5);
    }

    .timeline .swiper-pagination {
        display: -webkit-box;
        display: flex;
    }

    .timeline .swiper-button-prev {
        top: 15%;
        left: auto;
        right: 15%;
        -webkit-transform: rotate(90deg) translate(0, 10px);
        transform: rotate(90deg) translate(0, 10px);
    }

    .timeline .swiper-button-prev:hover {
        -webkit-transform: rotate(90deg) translate(-3px, 10px);
        transform: rotate(90deg) translate(-3px, 10px);
    }

    .timeline .swiper-button-next {
        top: auto;
        bottom: 15%;
        right: 15%;
        -webkit-transform: rotate(90deg) translate(0, 10px);
        transform: rotate(90deg) translate(0, 10px);
    }

    .timeline .swiper-button-next:hover {
        -webkit-transform: rotate(90deg) translate(3px, 10px);
        transform: rotate(90deg) translate(3px, 10px);
    }
}

@media screen and (min-width: 1024px) {
    .timeline .swiper-slide::after {
        right: -20%;
        bottom: -12%;
        width: 240px;
        height: 50%;
        box-shadow: -230px 0 150px 45vw rgba(0, 0, 0, 0.6);
    }

    .timeline .swiper-slide-content {
        right: 25%;
    }
}

.timeline-title.with-line {
    margin-bottom: 25px !important;
}

.timeline-title.with-line::before {
    content: '';
    position: absolute;
    bottom: -15px;
    min-width: 200px;
    height: 1px;
    background-color: rgba(0, 137, 205, 0.5);
}

@media screen and (max-width: 768px) {
    .timeline .swiper-pagination {
        width: 50px;
        margin-left: auto;
    }
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(0.77);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(.55);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(.77);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(.55);
}



.nav-pills-custom .nav-link {
    display: flex;
    color: rgb(32, 32, 32);
    background: rgb(204, 230, 248);
    position: relative;
    margin-bottom: 10px;
    border-top-left-radius: 35px;
    border-bottom-left-radius: 35px;
    padding: 0px;
    padding-right: 10px;
    line-height: 47px;
    box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15);
}

.nav-pills-custom a span.icon {
    display: inline-block;
    width: 45px;
    height: 45px;
    border-radius: 100%;
    border: 2px solid #0089cf;
    margin-right: 10px;
    background-position: center;
    background-size: 75%;
    background-repeat: no-repeat;
    transform: translate(1px, 1px);
    background-color: rgba(255, 255, 255, 0.9);
}

.nav-pills-custom .nav-link.active {
    color: #fff;
    background: rgb(0, 137, 207);
    background: linear-gradient(90deg, rgba(0, 137, 207, 1) 0%, rgba(204, 230, 248, 1) 100%);
}

.nav-pills-custom .nav-link.active span.icon {
    background-color: transparent;
    filter: brightness(0) invert(1);
}

.nav-pills-custom .nav-link::after {
    content: '';
    display: block;
    width: 0;
    height: 100%;
    background-color: rgb(204, 230, 248);
    position: absolute;
    top: calc(50% - 0px);
    right: -30px;
    transform: translateY(-50%);
    transition: ease-out all 0.3s;
}

#v-pills-tabContent2 .tab-pane {
    min-height: 445px;
}

/* Add indicator arrow for the active tab */
@media (min-width: 992px) {
    .nav-pills-custom .nav-link.active::after {
        content: '';
        display: block;
        width: 40px;
        height: 100%;
        background-color: rgb(204, 230, 248);
        position: absolute;
        top: calc(50% - 1px);
        right: -35px;
        transform: translateY(-50%);
    }
}

.nav-pills-custom {
    counter-reset: my-sec-counter;

}

.nav-pills-custom a::before {
    background-color: white;
    border: 2px solid #0089cf;
    border-radius: 50%;
    counter-increment: my-sec-counter;
    content: counter(my-sec-counter);
    display: inline-block;
    height: 40px;
    float: left;
    font-size: 16px;
    line-height: 38px;
    margin-right: 10px;
    position: relative;
    text-align: center;
    width: 40px;
    transition: all linear 0.3s;
    display: none;
}

.nav-pills-custom .nav-link.active::before {
    background-color: #0089cf;
    color: white;
}

.tab-content .tab-pane {
    background-color: rgb(255, 255, 255);
    box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15);
}

.accordion .card {
    border-radius: 1.5rem;
    margin-bottom: 5px;
    box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15);
}

.accordion>.card:not(:first-of-type) {
    border-radius: 1.5rem;
    border: 0;
}

.accordion>.card:not(:last-of-type) {
    border: 0;
    border-radius: 1.5rem;
}

.accordion a,
.accordion a:hover {
    text-decoration: none;
}

.accordion .btn-link {
    color: #0089cf;
}

.accordion .btn-link.collapsed {
    color: rgb(32, 32, 32);
}

.accordion>.card>.card-header {
    border-radius: 2px;
    margin-bottom: 0px;
    padding: 0;
    background-color: #fff;
    border-bottom: 0;
}

.accordion>.card>.card-header .btn-link {
    font-size: 14px;
    display: block;
    padding: 10px 20px;
}

.accordion>.card>.card-header .btn-link::before {
    content: "\f107";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    position: absolute;
    right: 20px;
    top: 10px;
    z-index: 1;
    font-size: 18px;
}

.accordion>.card>.card-header .btn-link:not(.collapsed)::before {
    content: "\f106";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    position: absolute;
    right: 20px;
    top: 10px;
    z-index: 1;
}

.accordion>.card>.card-header .btn-link:not(.collapsed) {
    background: linear-gradient(90deg, #0089cf 0%, rgb(80, 187, 242) 100%);
    color: rgb(255, 255, 255);
}

.accordion>.card ol,
.accordion>.card ol li {
    list-style-type: decimal;
}

.accordion>.card ol,
.accordion>.card ul {
    margin-left: 15px;
}

.card ol li {
    margin-bottom: 15px;
}

.card ul li {
    margin-bottom: 10px;
}

.card ul {
    margin: 10px 0;
}

.accordion p {
    color: unset;
}

.card-header:has(.btn-link.collapsed) {
    background-color: #000;
}

section.chart {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem 1rem;
    flex-wrap: wrap;
}
section.chart h1 {
    font-weight: 800;
    font-size: 1.8rem;
}

/* have the svg occupy a sizeable portion of the wrapping container */
section.chart svg {
    margin-top: 2.5rem;
    width: 90%;
    height: auto;
    background-image: url('../images/bg/logo_transparent_bg.png');
    background-size: 275px;
    background-position: 50% 62%;
    background-repeat: no-repeat;
}

section.chart svg line {
    opacity: 0;
}

main {
    background: #ffffff;
    margin: 1.5rem auto;
    box-shadow: 0 2px 15px hsla(0, 0%, 0%, 0.1);
}

table.dataTable thead .sorting_asc {
    background-image: url("../images/icons/table/sort_asc.png");
}

table.dataTable thead .sorting_desc {
    background-image: url("../images/icons/table/sort_desc.png");
}

table.dataTable thead .sorting {
    background-image: url("../images/icons/table/sort_both.png");
}

table.dataTable.no-footer {
    border-bottom: 0px solid #0089cf;
}

table.dataTable {
    border-collapse: collapse;
    border-spacing: 0;
}

table.dataTable thead th {
    border-bottom: 2px solid rgb(222, 226, 230);
}

table.dataTable thead th,
table.dataTable tfoot th {
    font-weight: 400;
    color: #0089cf;
}

.dataTables_wrapper .dataTables_length select {
    font-family: arial;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #333 !important;
    border: 1px solid #0089cf;
    background-color: white;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #afd9f4), color-stop(100%, #cce6f8));
    background: -webkit-linear-gradient(top, #afd9f4 0%, #cce6f8 100%);
    background: -moz-linear-gradient(top, #afd9f4 0%, #cce6f8 100%);
    background: -ms-linear-gradient(top, #afd9f4 0%, #cce6f8 100%);
    background: -o-linear-gradient(top, #afd9f4 0%, #cce6f8 100%);
    background: linear-gradient(to bottom, #afd9f4 0%, #cce6f8 100%);
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: white !important;
    border: 1px solid #0089cf;
    background-color: #585858;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(63, 190, 255)), color-stop(100%, #0089cf));
    background: -webkit-linear-gradient(top, rgb(63, 190, 255) 0%, #0089cf 100%);
    background: -moz-linear-gradient(top, rgb(63, 190, 255) 0%, #0089cf 100%);
    background: -ms-linear-gradient(top, rgb(63, 190, 255) 0%, #0089cf 100%);
    background: -o-linear-gradient(top, rgb(63, 190, 255) 0%, #0089cf 100%);
    background: linear-gradient(to bottom, rgb(63, 190, 255) 0%, #0089cf 100%);
}

i.download {
    font-size: 28px;
    color: #0089cf;
    text-shadow: 0 0 1px rgba(24, 94, 224, 0.15), 0 1px 4px rgba(24, 94, 224, 0.4);
}

.contact-list .badge-primary {
    color: #0089cf;
    background-color: rgba(0, 137, 207, 0.14);
    font-size: 15px;
    font-weight: 400;
    padding: 8px 15px;
}

.contact-list .badge-primary.icon {
    color: #0089cf;
    background-color: rgba(0, 137, 207, 0.14);
    font-size: 20px;
    padding: 0px;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 42px;
    text-align: center;
    box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15);
}

.shadow {
    box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15) !important;
}

.fadeContainer::before,
.fadeContainer::after {
    display: none;
}

.text-center p {
    text-align: center !important;
}

.team-carousel p {
    text-align: center;
    height:45px;
}

.animated {
    -webkit-animation-duration: 1.5s;
    animation-duration: 2.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
}

#gas-values {
    text-align: center
}

#gas-values .features-title {
    display: inline-block;
    position: relative;
    color: #404040;
    font-size: 32px;
    font-family: "Roboto";
    font-weight: 400;
    line-height: 46px;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin: 1em 0
}

#gas-values .features-title::after {
    display: block;
    position: absolute;
    bottom: -.2em;
    left: 50%;
    margin-left: -40px;
    content: "";
    width: 80px;
    height: 3px;
    background-color: #00BFF3;
}

#gas-values .features-content {
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    align-items: center;
    padding-bottom: 5em;
    margin-bottom: 5em;
}

#gas-values .features-content+.features-content {
    border: 0
}

#gas-values .features-content-col {
    width: 50%;
    text-align: left
}

#gas-values .features-content-style {
    background: aliceblue;
    padding: 20px;
    box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15);
}

#gas-values .features-textblock {
    display: none;
    position: relative
}

#gas-values .features-textblock.__active {
    display: block
}

#gas-values .features-graph {
    height: 425px;
    margin: 25px
}

#gas-values .features-graph .button-holder {
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
    align-items: center
}

#gas-values .features-graph .animation-holder {
    display: flex;
    justify-content: center;
    align-items: center
}

#gas-values .features-graph .flash-oval {
    background-color: #00bff3;
    width: 12em;
    height: 12em;
    border-radius: 7em;
    -webkit-transform: translateX(1px);
    -ms-transform: translateX(1px);
    transform: translateX(1px);
    z-index: 100;
    margin: 10em auto 9em auto
}

#gas-values .features-graph .flash-oval img {
    position: absolute;
    right: 32px;
    top: 23px;
}

#gas-values .features-graph .btn-with-icon {
    display: block;
    width: 70px;
    height: 70px;
    background-color: #fff;
    border: 1px solid #0089cf;
    border-radius: 100%;
    transition-duration: 0.3s;
    background-position: center;
    background-repeat: no-repeat;
    line-height: 5em;
    z-index: 0;
    cursor: pointer;
    text-align: center;
    opacity: 0.5;
    filter: alpha(opacity=50)
}

#gas-values .features-graph .btn-with-icon.__active {
    opacity: 1;
    filter: alpha(opacity=100)
}

#gas-values .features-graph .btn-with-icon:hover {
    opacity: 1
}

#gas-values .features-graph .sq-bt-label {
    letter-spacing: 0;
    color: rgb(36, 36, 36);
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    position: absolute;
    text-transform: uppercase;
    margin-top: 80px;
    transform: translateX(-45px);
}

/*#gas-values .features-graph .label-top-left {
    right: 38%;
    top: 30%;
}
#gas-values .features-graph .label-top {
    right: 24.3%;
    top: 30%;
}
#gas-values .features-graph .label-top-right {
    right: 10.7%;
    top: 30%;
}
#gas-values .features-graph .label-bottom-left {
    right: 36.3%;
    bottom: 13%;
}
#gas-values .features-graph .label-bottom {
    right: 21.4%;
    bottom: 13%;
}
#gas-values .features-graph .label-bottom-right {
    right: 6.6%;
    bottom: 13%;
}*/
#gas-values .features-graph .icon-features-1:after {
    content: ' ';
    background-image: url(../images/design/top-left.svg);
    background-size: 100%;
    height: 110px;
    width: 85px;
    background-repeat: no-repeat;
    position: absolute;
    top: 36.4%
}

#gas-values .features-graph .icon-features-2:after {
    content: ' ';
    background-image: url(../images/design/top.svg);
    height: 110px;
    width: 85px;
    background-repeat: no-repeat;
    position: absolute;
    top: 36.4%
}

#gas-values .features-graph .icon-features-3:after {
    content: ' ';
    background-image: url(../images/design/top-right.svg);
    background-size: 100%;
    height: 110px;
    width: 85px;
    background-repeat: no-repeat;
    position: absolute;
    top: 36.4%;
    right: 10%
}

#gas-values .features-graph .icon-features-4:after {
    content: ' ';
    background-image: url(../images/design/bottom-left.svg);
    background-size: 100%;
    height: 110px;
    width: 85px;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 26%
}

#gas-values .features-graph .icon-features-5:after {
    content: ' ';
    background-image: url(../images/design/bottom.svg);
    height: 110px;
    width: 85px;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 23%
}

#gas-values .features-graph .icon-features-6:after {
    content: ' ';
    background-image: url(../images/design/bottom.svg);
    height: 110px;
    width: 85px;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 23%
}

#gas-values .features-graph .icon-features-7:after {
    content: ' ';
    background-image: url(../images/design/bottom-right.svg);
    background-size: 100%;
    height: 110px;
    width: 85px;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 26%;
    right: 10%
}

#gas-values .features-graph #top-left-line {
    position: absolute;
    top: 170px;
    left: 50px;
    z-index: -4
}

#gas-values .features-graph .icon-features-1 {
    background-image: url('../images/gas-value-chain/icon-1.png');
    background-size: 65%;
    background-position: center;
}

#gas-values .features-graph .icon-features-2 {
    background-image: url('../images/gas-value-chain/icon-2.png');
    background-size: 65%;
    background-position: center;
}

#gas-values .features-graph .icon-features-3 {
    background-image: url('../images/gas-value-chain/icon-3.png');
    background-size: 65%;
    background-position: center;
}

#gas-values .features-graph .icon-features-4 {
    background-image: url('../images/gas-value-chain/icon-4.png');
    background-size: 65%;
    background-position: center;
}

#gas-values .features-graph .icon-features-5 {
    background-image: url('../images/gas-value-chain/icon-5.png');
    background-size: 65%;
    background-position: center;
}

#gas-values .features-graph .icon-features-6 {
    background-image: url('../images/gas-value-chain/icon-6.png');
    background-size: 65%;
    background-position: center;
}

#gas-values .features-graph .icon-features-7 {
    background-image: url('../images/gas-value-chain/icon-7.png');
    background-size: 65%;
    background-position: center;
}

#gas-values .features-graph .wave {
    position: absolute;
    opacity: 0;
    width: 12em;
    height: 12em;
    border: #56a9e8 1px solid;
    border-radius: 7em;
    -webkit-animation-name: ripple;
    animation-name: ripple;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: linear;
    animation-iteration-count: linear;
    text-align: center;
    top: 0
}

#gas-values .features-graph .wave2 {
    position: absolute;
    opacity: 0;
    width: 12em;
    height: 12em;
    border: #56a9e8 1px solid;
    border-radius: 7em;
    -webkit-animation-name: ripple2;
    animation-name: ripple2;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: linear;
    animation-iteration-count: linear;
    top: 0;
    text-align: center
}

#gas-values .features-graph .wave3 {
    position: absolute;
    opacity: 0;
    width: 12em;
    height: 12em;
    border: #56a9e8 1px solid;
    border-radius: 7em;
    -webkit-animation-name: ripple3;
    animation-name: ripple3;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: linear;
    animation-iteration-count: linear;
    text-align: center;
    top: 0
}

#gas-values .features-graph .wave4 {
    position: absolute;
    opacity: 0;
    width: 12em;
    height: 12em;
    border: #56a9e8 1px solid;
    border-radius: 7em;
    -webkit-animation-name: ripple4;
    animation-name: ripple4;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: linear;
    animation-iteration-count: linear;
    text-align: center;
    top: 0
}

@-webkit-keyframes ripple {
    from {
        opacity: 0.8
    }

    to {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        opacity: 0
    }
}

@keyframes ripple {
    from {
        opacity: 0.8
    }

    to {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        opacity: 0
    }
}

@-webkit-keyframes ripple2 {
    from {
        opacity: 0.7
    }

    to {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0
    }
}

@keyframes ripple2 {
    from {
        opacity: 0.7
    }

    to {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0
    }
}

@-webkit-keyframes ripple3 {
    from {
        opacity: 0.7
    }

    to {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0
    }
}

@keyframes ripple3 {
    from {
        opacity: 0.7
    }

    to {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0
    }
}

@-webkit-keyframes ripple4 {
    from {
        opacity: 0.6
    }

    to {
        -webkit-transform: scale(2.5);
        transform: scale(2.5);
        opacity: 0
    }
}

@keyframes ripple4 {
    from {
        opacity: 0.4
    }

    to {
        -webkit-transform: scale(2.5);
        transform: scale(2.5);
        opacity: 0
    }
}

#gas-values .features-items {
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-flow: row wrap;
    list-style: none;
    margin: 0;
    padding: 0
}

#gas-values .features-items li {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 50%;
    text-align: left;
    padding: 20px 50px 20px 20px
}

.hidden {
    display: none;
}

.visible {
    display: block;
}


#gas-values .features-graph {
    height: 425px;
    margin: 25px
}

#gas-values .features-graph .button-holder {
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    align-items: center
}

#gas-values .features-graph .animation-holder {
    display: flex;
    justify-content: center;
    align-items: center
}

#gas-values .features-graph .flash-oval {
    background-color: #0089cf;
    width: 12em;
    height: 12em;
    border-radius: 7em;
    -webkit-transform: translateX(1px);
    -ms-transform: translateX(1px);
    transform: translateX(1px);
    z-index: 100;
    margin: 7em auto 5em auto;
}

#gas-values .features-graph .flash-oval img {
    position: absolute;
    right: 0;
    top: 20%;
    left: 5px;
    margin: 0 auto;
    /* bottom: 0; */
}

footer {
    padding: 30px 0 2px;
    background-image: url(../images/bg/footer_bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    color: #fff;
    margin-top: 30px;
}

footer h4 {
    font-size: 18px;
    font-weight: normal;
    color: #fff;
}

footer .nav a {
    color: rgba(255, 255, 255, 0.8);
    font-size: 13px;
    transition: all .3s ease;
}

footer .nav a:hover {
    color: rgba(255, 255, 255, 1);
}

footer img {
    max-width: 120px;
}

footer .social a {
    font-size: 22px;
    padding: 0 15px;
}

footer .small {
    font-size: 12px;
}

footer hr {
    background: rgba(255, 255, 255, 0.2);
}

/* Responsive */
@media only screen and (max-width: 1440px) {
    .csr .fixed-bg.bg-left{
        background-position: right center !important;
        background-size: 60% !important;
    }
    .csr .fixed-bg:not(.bg-left){
        background-size: 60% !important;
        background-position: left center !important;
    }
}
@media only screen and (max-width: 850px) {

    .h2,
    h2 {
        font-size: 1.5rem;
    }

    .home-icons .icon {
        width: 150px !important;
        height: 150px;
    }
    .home-icons .icon:hover {
        height: 150px;
    }
    .home-icons .icon img {
        max-width: 80px;
        margin: 0 auto;
    }
    .home-icons h2 {
        height: 45px;
    }
    .fixed-bg video {
        min-height: 220px !important;
    }

    .home-icons .icon::after {
        top: 0 !important;
        height: 0 !important;
    }

    .home-icons .col {
        margin-bottom: 20px;
        max-width: 50%;
    }

    .home-icons::before {
        display: none;
    }

    .tp-rightarrow,
    .tp-leftarrow {
        bottom: -20px !important;
    }

    .tp-caption {
        font-size: 20px !important;
    }

    .featured-section .d-flex {
        display: -ms-flexbox !important;
        display: flex !important;
        flex-direction: column;
    }

    .featured-section .col-md-6,
    .row.d-flex.align-items-center.mt-3 .col-md-6 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .featured-section .d-flex img {
        width: 100%;
        height: auto;
        margin-top: 10px;
    }

    .featured-section {
        padding: 20px 0;
    }

    .featured-section h1 {
        font-size: 1.5rem;
    }

.featured-section h1{
		color: #fff; !important;
		font-weight: 500; !important;
	}	

    .home .fixed-bg {
        background-position: 80% center;
    }

    .counters .counter-box {
        margin: 0 auto;
    }

    .flame-bg .text-left p {
        text-align: center !important;
    }

    .fixed-bg .p-5 {
        padding: 1rem !important;
    }

    footer {
        text-align: center;
    }

    footer img.ml-5 {
        margin-left: 0rem !important;
        margin-top: 20px;
    }

    footer .d-flex {
        flex-direction: column;
    }

    footer p {
        text-align: center;
    }

    .page-title .d-flex>div:nth-child(2) {
        display: none;
    }

    .page-title .d-flex h3 {
        padding: 10px 0;
    }

    .has-bg {
        background-image: none !important;
    }

    .our-buyers .d-flex.align-items-start.text-center {
        flex-direction: column;
    }

    .our-buyers .d-flex.align-items-start.text-center>div {
        width: calc(100vw - 40px);
    }

    .container.position-relative .swiper-button-next {
        right: 0 !important;
    }

    .container.position-relative .swiper-button-prev {
        left: 0 !important;
    }

    .half-circle-bg .d-flex.align-items-start {
        flex-direction: column;
    }

    .half-circle-bg .col-md-6.blue-color {
        text-align: center;
    }

    .fixed-bg.border-img {
        background-size: 160% !important;
        background-position: center !important;
    }

    .fadeContainer {
        min-height: 200px !important;
    }

    .slider-content {
        min-width: 100% !important;
    }

    .slider-content .image-caption {
        top: 16rem !important;
        left: 2rem !important;
    }

    .slider-content .image-caption h4 {
        font-size: 25px !important;
    }

    .footer-wrapper {
        width: 100% !important;
        height: auto !important;
    }

    .slider-content .slider-container {
        height: 75rem !important;
    }

    .footer-wrapper li {
        width: 100% !important;
        border-right: 0px solid rgba(0, 0, 0, 0.2) !important;
        border-top: 1px solid rgba(0, 0, 0, 0.2);
    }

    .step-list__item .icon {
        width: 75px !important;
        height: 75px !important;
    }

    .step-list__item .body {
        margin-left: 50px !important;
    }

    .step-list__item .content::before {
        left: 25px !important;
    }

    .step-list__item::before {
        margin-right: -5px !important;
        margin-left: 20px !important;
    }

    .timeline .swiper-slide .timeline-title {
        font-size: 20px !important
    }

    .timeline .swiper-container {
        height: 310px !important;
    }

    .timeline .swiper-slide {
        background-size: 270% !important;
        background-position: 20% center !important;
    }

    .container.mt-4>.d-flex.align-items-center {
        flex-direction: column;
    }

    .nav-pills-custom .nav-link {
        border-radius: 35px !important;
    }

    .accordion>.card ol,
    .accordion>.card ul {
        margin-left: 0 !important;
        padding-left: 10px !important;
    }

    .nav-pills-custom .nav-link {
        padding: 0px !important;
        white-space: nowrap;
        font-size: 14px;
    }

    .contact-list .badge-primary.icon {
        display: table !important;
        margin-bottom: 10px !important;
    }

    footer .mr-5 {
        margin-right: 0 !important;
        margin-top: 15px;
    }

    .swiper-button-prev::after,
    .swiper-container-rtl .swiper-button-next::after {
        content: 'prev' !important;
    }

    .swiper-button-next::after,
    .swiper-container-rtl .swiper-button-prev::after {
        content: 'next' !important;
    }

    .slider-content .title-wrapper {
        margin-top: 25rem;
    }

    section.chart svg {
        margin-top: 2.5rem;
        width: 130%;
        height: auto;
        background-image: url('../images/bg/logo_transparent_bg.png');
        background-size: 30%;
        background-position: 50% 62%;
        background-repeat: no-repeat;
    }

    section.chart svg text,
    section.chart svg tspan {
        font-size: 11px;
    }

    .team-carousel .swiper-slide {
        text-align: center;
        margin-top: 0 !important;
        width: 28%;
        height: 250px !important;
        position: relative;
        transition-property: transform;
        margin-left: 40px;
    }

    .team-carousel.swiper-container-multirow-column>.swiper-wrapper {
        height: 1350px !important;
    }

    .team .swiper-button-next {
        left: 0px;
        transform: translateY(35px) rotate(90deg);
    }
}

@media only screen and (width: 768px) {
    .row.value-items .col-md-4 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .has-bg {
        background: url(../images/bg/keyfacts_bg.png) no-repeat center 30% !important;
        background-size: 60% !important;
    }

    .fadeContainer {
        min-height: 395px !important;
    }

    .half-circle-bg .col-md-6.blue-color,
    .gray-gradient .col-md-6 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        text-align: left;
    }

    .gray-gradient .col-md-6 {
        margin-bottom: 15px;
    }

    .fixed-bg.border-img {
        background-size: 100% !important;
    }

    .slider-content .slider-container {
        height: 60rem !important;
    }

    .step-list__item {
        display: -webkit-box;
        display: flex;
    }

    .step-list__item:before {
        content: counter(step-counter);
        position: relative;
        font-size: 36px;
        line-height: 42px;
        font-weight: 300;
        color: #000000;
        margin-right: 12px;
    }

    .step-list__item .icon {
        -webkit-box-ordinal-group: 1;
        order: 0;
        width: 36px;
        height: 36px;
        padding: 9px;
        position: absolute;
        left: -9px;
        top: 42px;
    }

    .step-list__item .body {
        -webkit-box-ordinal-group: 2;
        order: 1;
        margin-top: 8px;
        margin-left: 12px;
    }

    .step-list__item .content {
        -webkit-box-align: start;
        align-items: flex-start;
    }

    .step-list__item .content:before {
        content: '';
        position: absolute;
        border-left: #d8d8d8;
        height: 100%;
        left: 9px;
        bottom: 0;
        display: block;
        width: 1px;
        background: #d8d8d8;
        top: 84px;
    }

    .step-list__item:last-child .content:before {
        content: none;
    }

    .step-list__item:nth-child(2n+1)>.step-list__item__inner::after {
        display: none;
    }

    .step-list__item:nth-child(2n)>.step-list__item__inner::before,
    .step-list__item:nth-child(2n)>.step-list__item__inner::after {
        display: none;
    }

    .step-list__item:nth-child(2n+1)>.step-list__item__inner::before {
        display: none;
    }

    .step-list__item .content {
        display: block;
    }

    .step-list__item:nth-child(2n+1) .icon {
        margin-left: -3px;
    }

    .step-list__item:nth-child(2n+1)::before {
        left: 40px;
    }

    .step-list__item .body {
        margin-left: 80px !important;
    }
}

@media only screen and (max-width: 550px) {
    .team-carousel .swiper-slide {
        width: 75%;
        height: 470px !important;
    }
    .team-carousel {
        max-height: 1400px;
    }
    .container.position-relative .swiper-button-prev {
        left: 15px !important;
    }
    .team .swiper-button-next {
        left: 15px;
        transform: translateY(35px) rotate(90deg);
    }
}

.valuechain-carousel{
    counter-reset: section;
    padding: 4rem 2.4rem;
}
.valuechain-carousel .swiper-slide{
    position: relative;
    transition: all 0.3s ease-in-out;
    background: #edf3fb;
}

.valuechain-carousel .swiper-slide .less-content{
    display:block;
    transition: all ease-in 0.2s;
}

.valuechain-carousel .swiper-slide .full-content{
    display:none;
    transition: all linear 0.2s;
}

.valuechain-carousel .swiper-slide .more-link{
    display:none;
    font-size: 40px;
    color: #fff;
    text-align: center;
}

.valuechain-carousel .swiper-slide:hover .more-link{
    display:block;
}

/* .valuechain-carousel .swiper-slide:hover .less-content{
    display:none;
}

.valuechain-carousel .swiper-slide:hover .full-content{
    display:block;
} */
.valuechain-carousel .swiper-slide:hover{
    background: rgb(26,77,112);
    background: linear-gradient(156deg, rgba(26,77,112,1) 0%, rgba(21,137,202,1) 100%); 
    transform: scale(1.1);
    box-shadow: 0px 0px 25px -3px #1b4c6f !important;
    z-index: 9999;
}

.valuechain-carousel .swiper-slide:hover img {
	filter: invert(1) grayscale(1) brightness(2);
}
.valuechain-carousel h2{
    font-size: 14px;
    text-align: center;
    padding: 15px 20px;
    opacity: 0;
    height:80px;
    color: #fff !important;
}
.valuechain-carousel h2::before {
    counter-increment: section;
    content: counter(section);
    position: absolute;
    font-size: 60px;
    font-weight: bold;
    left: -15px;
    top:0;
    opacity: 0;
    /*text-shadow: 1px 1px 2px #1b4c6f;*/
  }
.valuechain-carousel p {
	padding: 5px 10px;
	text-align: left;
	opacity: 0;
	font-size: 13px;
	line-height: 16px;
}
  .valuechain-carousel .swiper-slide:hover p, .valuechain-carousel .swiper-slide:hover h2, .valuechain-carousel .swiper-slide:hover h2::before{
      opacity: 1;
      color: #fff;
  }
.valuechain-carousel .more{
    height:100px;
    overflow: hidden;
}
.valuechain-carousel .swiper-slide:hover .more{
    height: auto;
}
.news-gallery .swiper-container {
    width: 100%;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
  }

  .news-gallery  .swiper-slide {
    background-size: cover;
    background-position: center;
  }

  .news-gallery  .gallery-top {
    height: 80%;
    width: 100%;
  }

  .news-gallery  .gallery-thumbs {
    height: 20%;
    box-sizing: border-box;
    padding: 10px 0;
  }

  .news-gallery .gallery-thumbs .swiper-slide {
    width: 25%;
    height: 100%;
    opacity: 0.4;
  }

  .news-gallery .gallery-thumbs .swiper-slide-thumb-active {
    opacity: 1;
  }

.less-content{
    height:60px;
}

h1.ArWBHeading-1 {
    font-weight: 500 !important;
}

.img-fluid{
	width: 100%;
}
div.ms-webpart-cell-vertical-inline-table {
    display: table;
}
.card-header-v2:has(.btn-link.collapsed) {
    background-color: transparent !important;
}
 